<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Example: Logger - Reading Logs (YUI Library)</title>
<link type="text/css" rel="stylesheet" href="../../build/reset/reset.css">
<link type="text/css" rel="stylesheet" href="../../build/fonts/fonts.css">
<link type="text/css" rel="stylesheet" href="../../build/grids/grids.css">
<link type="text/css" rel="stylesheet" href="../../build/logger/assets/logger.css">
<link type="text/css" rel="stylesheet" href="./css/examples.css">
<link type="text/css" rel="stylesheet" href="../../docs/assets/dpSyntaxHighlighter.css" />
<style type="text/css">
.yui-log .mytype {background-color:#FF99CC;}
</style>
</head>

<body>
<div id="doc" class="yui-t7">
    <div id="hd">
        <h1><img src="./img/logo.gif" class="logo" alt="Y!"/><a href="./">Logger Widget</a> :: Reading Logs</h1>
    </div>

    <div id="bd">
        <!-- Content begins -->
        <div id="yui-main">
        <div class="yui-b">
            <div class="yui-gc">
                <div class="yui-u first">
                    <h3>Default LogReader Example</h3>
                    <p>With just a few lines of code, you can put a LogReader on any web
                    page to display log messages built into the YUI Library or custom
                    log messages that you write into your own code. The LogReader
                    will look for the YUI Library's Drag and Drop
                    utility to make the LogReader automatically draggable.</p>

                    <p><input id="yui-log-inputinfo" class="yui-log-input" type="text" value="Log an info message.">
                        <button onclick="YAHOO.log(document.getElementById('yui-log-inputinfo').value,'info')">Log</button></p>
                    <p><input id="yui-log-inputwarn" class="yui-log-input" type="text" value="Log a warning.">
                        <button onclick="YAHOO.log(document.getElementById('yui-log-inputwarn').value,'warn')">Log</button></p>
                    <p><input id="yui-log-inputerror" class="yui-log-input" type="text" value="Log an error.">
                        <button onclick="YAHOO.log(document.getElementById('yui-log-inputerror').value,'error')">Log</button></p>
                    <p><input id="yui-log-inputtime" class="yui-log-input" type="text" value="Log a timing message.">
                        <button onclick="YAHOO.log(document.getElementById('yui-log-inputtime').value,'time')">Log</button></p>
                    <p><input id="yui-log-inputwindow" class="yui-log-input" type="text" value="Log a window error.">
                        <button onclick="someUndefinedFunction();">Log</button> (not supported in Opera, Safari)</p>
                    <p><input id="yui-log-inputcustommsg" class="yui-log-input" type="text" value="Log a custom type message.">
                        <input id="yui-log-inputcustomtype" type="text" value="mytype">
                        <button onclick="YAHOO.log(document.getElementById('yui-log-inputcustommsg').value,document.getElementById('yui-log-inputcustomtype').value)">Log</button></p>

                    <p><a href="javascript:YAHOO.example.LogReader.hideAllReaders();">Hide All LogReaders</a> ||
                    <a href="javascript:YAHOO.example.LogReader.showAllReaders();">Show All LogReaders</a></p>

                    <p><a href="javascript:YAHOO.widget.Logger.enableBrowserConsole();">Enable Output to console.log()</a> ||
                    <a href="javascript:YAHOO.widget.Logger.disableBrowserConsole();">Disable Output to console.log()</a></p>

                    <p><a href="javascript:YAHOO.widget.Logger.reset();">Reset Logger stack</a></p>
                </div>
            </div>

            <div class="yui-g">
                <!-- Sample code begins -->
                <div id="code">
                    <h3>Sample Code</h3>

                    <textarea name="code" class="HTML" cols="60" rows="1">
                    <head>
                    <style type="text/css">
                    /* A style was defined for a custom category.
                    By convention, it is defined with narrow-scope
                    selectors to achieve namespacing*/
                    .yui-log .mytype {background-color:#FF99CC;}
                    </style>
                    </head>

                    <body>
                    <!-- No custom markup was defined -->

                    <script type="text/javascript">
                    // A single line of JavaScript can get you up and logging
                    myLogReader1 = new YAHOO.widget.LogReader();

                    // A couple configurations make for quick customization
                    myLogReader2 = new YAHOO.widget.LogReader();
                    myLogReader2.compactOutput = true;
                    myLogReader2.newestOnTop = false;
                    myLogReader2.setTitle("Logger Console: Oldest > on > Top!");
                    </script>
                    </body>
                    </textarea>
                </div>
                <!-- Code sample ends -->
            </div>
        </div>
        </div>
        <!-- Content ends -->
    </div>
</div>
<!-- Libary begins -->
<script type="text/javascript" src="../../build/yahoo/yahoo.js"></script>
<script type="text/javascript" src="../../build/dom/dom.js"></script>
<script type="text/javascript" src="../../build/event/event.js"></script>
<script type="text/javascript" src="../../build/dragdrop/dragdrop.js"></script>
<script type="text/javascript" src="../../build/logger/logger.js"></script>
<!-- Library ends -->

<script type="text/javascript">
YAHOO.example.LogReader = function() {
    var myLogReader1;
    var myLogReader2;
    
    return {
        init: function() {
            // A single line of JavaScript can get you up and logging
            myLogReader1 = new YAHOO.widget.LogReader(null, {verboseOutput:false});
            
            // A couple configurations make for quick customization
            myLogReader2 = new YAHOO.widget.LogReader(null, {newestOnTop:false});
            myLogReader2.setTitle("Logger Console: Oldest > on > Top!");
            myLogReader2.compactOutput = true;
        },

        hideAllReaders: function() {
            myLogReader1.hide();
            myLogReader2.hide();
        },

        showAllReaders: function() {
            myLogReader1.show();
            myLogReader2.show();
        }
    };
}();

YAHOO.util.Event.addListener(this,'load',YAHOO.example.LogReader.init);
</script>

<script type="text/javascript" src="../../docs/assets/dpSyntaxHighlighter.js"></script>
<script type="text/javascript">
dp.SyntaxHighlighter.HighlightAll('code');
</script>

</body>
</html>
